<template>
	<view class="procard" :style="{'--themcolor':usethemestore.themecolor,'--themcolor2':usethemestore.themecolor2}" v-if="data">
		<image :src="'http://127.0.0.1:3006'+data.img" mode="aspectFill"></image>
		<view>
			<view class="tit">{{data.title}}</view>
			<view class="">热卖中</view>
			<view class="fen" v-if="isfen"> <text>3.9分</text> </view>
			<view class="pri">￥ <text>{{data.price}}</text> </view>
		</view>
	</view>
</template>

<script setup>
	import themestore from '@/store/theme.js'
	const usethemestore = themestore()
	defineProps({
		isfen:{
			type:Boolean,
			 default:true
		},
		data:{
			type:Object
		}
	})

</script>

<style lang="scss" scoped>
	.procard {
		height: 250rpx;
		width: 100%;
		display: flex;
		padding: 20rpx 0;
		border-bottom: 1rpx solid #eee;
		gap: 20rpx;

		image {
			height: 205rpx;
			width: 205rpx;
			border-radius: 20rpx;
		}

		>view {
			flex: 1;
			display: flex;
			flex-direction: column;
			justify-content: space-around;
			color: #7b7b7b;
			font-size: 27rpx;

			.tit {
				max-height: 75rpx;
				font-size: 30rpx;
				overflow: hidden;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
				color: #000;
			}

			.fen {
				text {
					color: var(--themcolor);
					margin-right: 10rpx;
				}
			}
			.pri{
				color:var(--themcolor);
				text{
					font-size: 40rpx;
					font-weight: 700;
				}
			}
		}
	}
</style>